{php $top_name=MODULE_NAME;}{template "header.html"}
<div class="page-container">
    <div class="page-content-wrapper">
        <div class="page-content bg-b">
            <div class="container pd-0">

                <div class="slide_tabs_wrap">
                    <div class="slide_tabs" id="wrapper2">
                        <ul id="scroller2">
                            <li class="current item"><a href="javascript:void(0);">全部</a></li>
                            {category pid=0 return=c}
                            <li class="item {if $catid==$c.id}current{/if}" ><a href="{$c.url}">{$c.name}</a></li>
                            {/category}
                        </ul>
                    </div>
                    <div class="node2">
                        <div class="hd"><span class="tit">全部</span></div>
                        <ul id="cloneNav" class="clearfix"></ul>
                    </div>
                    <div class="more" id="iscrollto"><span></span></div>
                    <script>
                        window['myScroll2'] = null;
                        (function($){
                            var star_nav = $('#scroller2');
                            star_nav.css('width',(90*star_nav.find('li').length)+'px');
                            window['myScroll2'] = new IScroll('#wrapper2', {
                                scrollX: true,
                                scrollY: false,
                                click:true,
                                keyBindings: true
                            });
                            $('#iscrollto').click(function(e){
                                e.preventDefault();
                                if(!$(this).parent().hasClass('open')){
                                    $(this).parent().addClass('open');
                                }else{
                                    $(this).parent().removeClass('open');
                                }
                            });
                            $('#cloneNav').html(star_nav.html());
                        })(jQuery);
                    </script>
                </div>

                <ul id="innerrow" class="list_normal list_news">
                    {template "list_data.html"}
                </ul>

                <div class="innerrow_ajax_loading">
                    <img src="{HOME_THEME_PATH}mobile/img/ajax-loading.gif">
                </div>

                <script>
                    var dr_page = 1;
                    var dr_rkcb = 1;
                    $(window).on("scroll", function() {
                        if (toBottom()) {
                            $('.innerrow_ajax_loading').show();
                            dr_page++; // 加载下一页的意思

                            $.get('{SITE_URL}index.php?s={MOD_DIR}&c=api&m=template&name=list_data.html&page='+dr_page, function (html) {
                                if (html.indexOf("<li>") == -1) {
                                    dr_rkcb = 0;
                                } else {
                                    $('#innerrow').append(html); // 将返回的内容追加到内容区域
                                    dr_rkcb = 1;
                                }
                                $('.innerrow_ajax_loading').hide();
                            });
                        }
                    });
                    function toBottom() {
                        if (dr_rkcb == 0) {
                            return false;
                        }
                        var scrollTop = $(window).scrollTop();
                        var clientHeight = $(window).height();
                        var offsetTop = $("#innerrow li:last-child").offset().top;
                        console.log(scrollTop + "..." + clientHeight + "..." + offsetTop);
                        if (scrollTop + clientHeight > offsetTop) {
                            dr_rkcb = 0;
                            return true;
                        } else {
                            return false;
                        }
                    }
                </script>
            </div>
        </div>
    </div>
</div>
{template "footer.html", "/"}